<template>
<div> 
    <input id="inputElement" class="inputElement" name="file" type="file" accept=".gz" display= "none"/>
     <el-button @click="upload" type="success">上传</el-button>
</div>
</template>

<script>
export default {
    name: 'MapUpload',
    props: {
       
    },
    methods: {
        upload() {
            var file = document.getElementById("inputElement").files[0];
            var map_name = file.name.split('.tar.gz', 1);
            var url = "http://10.7.5.88:8080/gs-robot/data/upload_map?map_name=" + map_name;

            var param = new FormData(); // 创建form对象
            param.append("file", file); // 通过append向form对象添加数据

            var xhr = new XMLHttpRequest();
            xhr.open("POST", url);
            let _that = this
            xhr.addEventListener("readystatechange", function () {
                if (this.readyState === 4) {
                if (this.status == 200) {
                    // console.log(this.responseText);
                    _that.$message.success('上传成功')
                }else{
                    _that.$message.error('上传失败')
                }
                }
            });
            var filereader = new FileReader();
            filereader.readAsArrayBuffer(file);
            filereader.onload = function (res) {
                var data = res.target.result;
                if (filereader.readyState == 2) {
                xhr.send(data);          
                }
            }
        },
    }
}
</script>